﻿@using BonjourQuotation.UI.Models.PartialModel
@using MvcCheckBoxList
@model OperationTechProgGridViewModel
@{
    Layout = null;
}
<script type="text/javascript">
    var TechProgModel;
    var SelectedTechProgGridData = [];
    var isViewButtons = "";
   
    LoadTechProgGrid(false);
    function LoadTechProgGrid(IsTechProgClientLoad) {
        if (!IsTechProgClientLoad)
            TechProgModel = $(@Html.Raw(Json.Encode(Model))).JSModel();
        var TechProgcolumnHeaders = [];
        var TechProgcolumns = [];
        var TechProgcolWidth = [];
        var TechProgcolOrder = [];
        var TechProgDetailDrop = [];

        $(TechProgModel[0].TechProgDetail).each(function (index, elem) {
            TechProgDetailDrop.push(elem.Text);
        });
        if (TechProgModel[0].OperationTechProgDayView) {
            if (TechProgModel[0].ViewTechProgDay == true) {
                TechProgcolumnHeaders.push($("#TechProgDayDiv").html());
                TechProgModel[0].OperationTechProgDayEdit ? TechProgcolumns.push({ data: "TechProgDay", type: "text" }) : TechProgcolumns.push({ data: "TechProgDay", type: "text", readOnly: true });
                TechProgcolWidth.push(80);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgDayLineNo);
                $("#TechProgGridTechProgDayDiv").hide();
            }
            else
                $("#TechProgGridTechProgDayDiv").show();
        }
        if (TechProgModel[0].OperationTechProgPrintView) {
            if (TechProgModel[0].ViewTechProgPrn == true) {
                TechProgcolumnHeaders.push($("#TechProgPrnDiv").html());
                TechProgModel[0].OperationTechProgPrintEdit ? TechProgcolumns.push({ data: "TechProgPrnFlag", type: "checkbox" }) : TechProgcolumns.push({ data: "TechProgPrnFlag", type: "checkbox" });
                TechProgcolWidth.push(50);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgPrintLineNo);
                $("#TechProgGridTechProgPrnDiv").hide();
            }
            else
                $("#TechProgGridTechProgPrnDiv").show();
        }
        if (TechProgModel[0].OperationTechProgDateView) {
            if (TechProgModel[0].ViewTechProgDate == true) {
                TechProgcolumnHeaders.push($("#TechProgDateDiv").html());
                TechProgModel[0].OperationTechProgDateEdit ? TechProgcolumns.push({ data: "TechProgDate", type: "date", dateFormat: 'D, dd/M/yy' }) : TechProgcolumns.push({ data: "TechProgDate", type: "date", dateFormat: 'D, dd/M/yy', readOnly: true });
                TechProgcolWidth.push(140);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgDateLineNo);
                $("#TechProgGridTechProgDateDiv").hide();
            }
            else
                $("#TechProgGridTechProgDateDiv").show();
        }
        if (TechProgModel[0].OperationTechProgTimeView) {
            if (TechProgModel[0].ViewTechProgTime == true) {
                TechProgcolumnHeaders.push($("#TechProgTimeDiv").html());
                TechProgModel[0].OperationTechProgTimeEdit ? TechProgcolumns.push({ data: "TechProgTime", type: "time" }) : TechProgcolumns.push({ data: "TechProgTime", type: "time", readOnly: true });
                TechProgcolWidth.push(90);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgTimeLineNo);
                $("#TechProgGridTechProgTimeDiv").hide();
            }
            else
                $("#TechProgGridTechProgTimeDiv").show();
        }
        if (TechProgModel[0].OperationTechProgDetailView) {
            if (TechProgModel[0].ViewTechProgDetail == true) {
                TechProgcolumnHeaders.push($("#TechProgDetailDiv").html());
                TechProgModel[0].OperationTechProgDetailEdit ? TechProgcolumns.push({ data: "TechProgDetail", type: "autocomplete", source: TechProgDetailDrop, strict: false }) : TechProgcolumns.push({ data: "TechProgDetail", type: "autocomplete", source: TechProgDetailDrop, strict: false, readOnly: true });
                TechProgcolWidth.push(220);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgDetailLineNo);
                $("#TechProgGridTechProgDetailDiv").hide();
            }
            else
                $("#TechProgGridTechProgDetailDiv").show();
        }
        if (TechProgModel[0].OperationTechProgDescriptionView) {
            if (TechProgModel[0].ViewTechProgDescription == true) {
                TechProgcolumnHeaders.push($("#TechProgDescriptionDiv").html());
                TechProgModel[0].OperationTechProgDescriptionEdit ? TechProgcolumns.push({ data: "TechProgDesc", type: "text" }) : TechProgcolumns.push({ data: "TechProgDesc", type: "text", readOnly: true });
                TechProgcolWidth.push(250);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgDescriptionLineNo);
                $("#TechProgGridTechProgDescriptionDiv").hide();
            }
            else
                $("#TechProgGridTechProgDescriptionDiv").show();

            if (TechProgModel[0].ViewTechProgDescription == true) {
                TechProgcolumnHeaders.push($("#TechProgEmployeeDiv").html());
                TechProgModel[0].OperationTechProgDescriptionEdit ? TechProgcolumns.push({ data: "TechProgEmployee", type: "text" }) : TechProgcolumns.push({ data: "TechProgEmployee", type: "text", readOnly: true });
                TechProgcolWidth.push(250);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgDescriptionLineNo);
                $("#TechProgGridTechProgEmployeeDiv").hide();
            }
            else
                $("#TechProgGridTechProgEmployeeDiv").show();
        }
        if (TechProgModel[0].OperationTechProgViaView) {
            if (TechProgModel[0].ViewTechProgVia == true) {
                TechProgcolumnHeaders.push($("#TechProgViaDiv").html());
                TechProgModel[0].OperationTechProgViaEdit ? TechProgcolumns.push({ data: "TechProgVia", type: "text" }) : TechProgcolumns.push({ data: "TechProgVia", type: "text", readOnly: true });
                TechProgcolWidth.push(250);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgViaLineNo);
                $("#TechProgGridTechProgViaDiv").hide();
            }
            else
                $("#TechProgGridTechProgViaDiv").show();
        }
        if (TechProgModel[0].OperationTechProgTypeView) {
            if (TechProgModel[0].ViewTechProgType == true) {
                TechProgcolumnHeaders.push($("#TechProgTypeDiv").html());
                TechProgModel[0].OperationTechProgTypeEdit ? TechProgcolumns.push({ data: "TechProgType", type: "text" }) : TechProgcolumns.push({ data: "TechProgType", type: "text", readOnly: true });
                TechProgcolWidth.push(150);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgTypeLineNo);
                $("#TechProgGridTechProgTypeDiv").hide();
            }
            else
                $("#TechProgGridTechProgTypeDiv").show();
        }
        if (TechProgModel[0].OperationTechProgVendorNameView) {
            if (TechProgModel[0].ViewTechProgVendorName == true) {
                TechProgcolumnHeaders.push($("#TechProgVendorNameDiv").html());
                TechProgModel[0].OperationTechProgVendorNameEdit ? TechProgcolumns.push({ data: "TechProgVendor", type: "text" }) : TechProgcolumns.push({ data: "TechProgVendor", type: "text", readOnly: true });
                TechProgcolWidth.push(200);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgVendorNameLineNo);
                $("#TechProgGridTechProgVendorNameDiv").hide();
            }
            else
                $("#TechProgGridTechProgVendorNameDiv").show();
        }
        if (TechProgModel[0].OperationTechProgVendorAddressView) {
            if (TechProgModel[0].ViewTechProgVendorAddress == true) {
                TechProgcolumnHeaders.push($("#TechProgVendorAddressDiv").html());
                TechProgModel[0].OperationTechProgVendorAddressEdit ? TechProgcolumns.push({ data: "TechProgVendorAddress", type: "text" }) : TechProgcolumns.push({ data: "TechProgVendorAddress", type: "text", readOnly: true });
                TechProgcolWidth.push(200);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgVendorAddressLineNo);
                $("#TechProgGridTechProgVendorAddressDiv").hide();
            }
            else
                $("#TechProgGridTechProgVendorAddressDiv").show();
        }
        if (TechProgModel[0].OperationTechProgVendorEmailView) {
            if (TechProgModel[0].ViewTechProgVendorEmail == true) {
                TechProgcolumnHeaders.push($("#TechProgVendorEmailDiv").html());
                TechProgModel[0].OperationTechProgVendorEmailEdit ? TechProgcolumns.push({ data: "TechProgVendorEmail", type: "text" }) : TechProgcolumns.push({ data: "TechProgVendorEmail", type: "text", readOnly: true });
                TechProgcolWidth.push(160);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgVendorEmailLineNo);
                $("#TechProgGridTechProgVendorEmailDiv").hide();
            }
            else
                $("#TechProgGridTechProgVendorEmailDiv").show();
        }
        if (TechProgModel[0].OperationTechProgGuideNameView) {
            if (TechProgModel[0].ViewTechProgGuideName == true) {
                TechProgcolumnHeaders.push($("#TechProgGuideNameDiv").html());
                TechProgModel[0].OperationTechProgGuideNameEdit ? TechProgcolumns.push({ data: "TechProgGuide", type: "text" }) : TechProgcolumns.push({ data: "TechProgGuide", type: "text", readOnly: true });
                TechProgcolWidth.push(200);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgGuideNameLineNo);
                $("#TechProgGridTechProgGuideNameDiv").hide();
            }
            else
                $("#TechProgGridTechProgGuideNameDiv").show();
        }
        if (TechProgModel[0].OperationTechProgGuidePhoneView) {
            if (TechProgModel[0].ViewTechProgGuidePhone == true) {
                TechProgcolumnHeaders.push($("#TechProgGuidePhoneDiv").html());
                TechProgModel[0].OperationTechProgGuidePhoneEdit ? TechProgcolumns.push({ data: "TechProgGuidePhone", type: "text" }) : TechProgcolumns.push({ data: "TechProgGuidePhone", type: "text", readOnly: true });
                TechProgcolWidth.push(140);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgGuidePhoneLineNo);
                $("#TechProgGridTechProgGuidePhoneDiv").hide();
            }
            else
                $("#TechProgGridTechProgGuidePhoneDiv").show();
        }
        if (TechProgModel[0].OperationTechProgCityView) {
            if (TechProgModel[0].ViewTechProgCity == true) {
                TechProgcolumnHeaders.push($("#TechProgCityDiv").html());
                TechProgModel[0].OperationTechProgCityEdit ? TechProgcolumns.push({ data: "TechProgCity", type: "text" }) : TechProgcolumns.push({ data: "TechProgCity", type: "text", readOnly: true });
                TechProgcolWidth.push(200);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgCityLineNo);
                $("#TechProgGridTechProgCityDiv").hide();
            }
            else
                $("#TechProgGridTechProgCityDiv").show();
        }
        if (TechProgModel[0].OperationTechProgAreaView) {
            if (TechProgModel[0].ViewTechProgArea == true) {
                TechProgcolumnHeaders.push($("#TechProgAreaDiv").html());
                TechProgModel[0].OperationTechProgAreaEdit ? TechProgcolumns.push({ data: "TechProgArea", type: "text" }) : TechProgcolumns.push({ data: "TechProgArea", type: "text", readOnly: true });
                TechProgcolWidth.push(200);
                TechProgcolOrder.push(TechProgModel[0].OperationTechProgAreaLineNo);
                $("#TechProgGridTechProgAreaDiv").hide();
            }
            else
                $("#TechProgGridTechProgAreaDiv").show();
        }
        for (var ind1 = 0; ind1 < TechProgcolOrder.length; ind1++)
            for (var ind2 = ind1 + 1; ind2 < TechProgcolOrder.length; ind2++) {
                if (TechProgcolOrder[ind2] < TechProgcolOrder[ind1]) {
                    var ord = TechProgcolOrder[ind2];
                    TechProgcolOrder[ind2] = TechProgcolOrder[ind1];
                    TechProgcolOrder[ind1] = ord;
                    var Header = TechProgcolumnHeaders[ind2];
                    TechProgcolumnHeaders[ind2] = TechProgcolumnHeaders[ind1];
                    TechProgcolumnHeaders[ind1] = Header;
                    var Width = TechProgcolWidth[ind2];
                    TechProgcolWidth[ind2] = TechProgcolWidth[ind1];
                    TechProgcolWidth[ind1] = Width;
                    var Col = TechProgcolumns[ind2];
                    TechProgcolumns[ind2] = TechProgcolumns[ind1];
                    TechProgcolumns[ind1] = Col;
                }
            }
        TechProgRedColorRenderer = function (instance, td, row, col, prop, value, cellProperties) {
            Handsontable.renderers.TextRenderer.apply(this, arguments);
            td.style.color = 'red';
        };
        TechProgBlackColorRenderer = function (instance, td, row, col, prop, value, cellProperties) {
            Handsontable.renderers.TextRenderer.apply(this, arguments);
            td.style.color = 'black';
        };
        TechProgRedColorRendererForNegative = function (instance, td, row, col, prop, value, cellProperties) {
            Handsontable.renderers.NumericRenderer.apply(this, arguments);
            td.style.color = 'red';
        };

        var TechProgdata = TechProgModel[0].Rows;
        if ($("#TechProgSearchGroupCode").val() == "")
            return;
        isViewButtons = $("#TechProgSearchGroupCode").val();
        $('#OperTechProgGrid').show();
        $('#OperTechProgGrid').handsontable({
            data: TechProgdata,
            minSpareRows: 1,
            colHeaders: TechProgcolumnHeaders,
            colWidths: TechProgcolWidth,
            contextMenu: false,
            manualColumnResize: true,
            manualRowResize: true,
            manualColumnMove: true,
            wordWrap: false,
            columns: TechProgcolumns,
            fixedColumnsLeft: TechProgModel[0].OperationTechProgFixedColumnCount,
            //  isEmptyRow: customIsEmptyRow,
            afterSelectionEnd: function (row1, column1, row2, column2) {
                SelectedTechProgGridData.length = 0;
                SelectedTechProgGridData.push(row1);
                SelectedTechProgGridData.push(row2);
                SelectedTechProgGridData.push(column1);
                SelectedTechProgGridData.push(column2);
                $("#TechProgGetSelected").removeAttr('disabled');
            },
            afterChange: function (data, source) {
                if (data != null) {
                    CheckOperTechProgDataChanges();
                }
            },
            cells: function (row, col, prop) {
                var Cellinstance = this;
                var cellProperties = {};
                if (Cellinstance.renderer == Handsontable.renderers.NumericRenderer && Cellinstance.instance.getDataAtCell(row, col) < 0) {
                    Cellinstance.renderer = TechProgRedColorRendererForNegative;
                }
                if (prop == "TechProgVendor") {
                    var Type = Cellinstance.instance.getData()[row].TechProgType;
                    if (Type == "Misc Comp") {
                        Cellinstance.renderer = TechProgRedColorRenderer;
                    }
                    else {
                        Cellinstance.renderer = TechProgBlackColorRenderer;
                    }
                }
            }
        });
        if ($("#TechProgIsRemoveFilterDivShow").val() == "True") {
            $("#TechProgRemoveFiltersDiv").show();
        }
    }
    function TechProgGetSelectedClick() {
        if ($("#TechProgForEmail").length > 0) {
            $("#TechProgForEmail").remove();
        }
        //get the instance using jQuery wrapper
        var SelectedTechProgGridDataHeaders = [];
        var SelectedTechProgElementValues = [];
        if (SelectedTechProgGridData[2] > SelectedTechProgGridData[3]) {
            var a = SelectedTechProgGridData[3];
            SelectedTechProgGridData[3] = SelectedTechProgGridData[2];
            SelectedTechProgGridData[2] = a;

        }
        if (SelectedTechProgGridData[0] > SelectedTechProgGridData[1]) {
            var a = SelectedTechProgGridData[0];
            SelectedTechProgGridData[0] = SelectedTechProgGridData[1];
            SelectedTechProgGridData[1] = a;

        }
        for (var ind = SelectedTechProgGridData[2]; ind <= SelectedTechProgGridData[3]; ++ind) {
            SelectedTechProgGridDataHeaders.push(($('#OperTechProgGrid').handsontable('getColHeader', ind)));
        }
        var hadstontabledata = $('#OperTechProgGrid').handsontable('getData', SelectedTechProgGridData[0], SelectedTechProgGridData[2], SelectedTechProgGridData[1], SelectedTechProgGridData[3]);
        $("#OperTechProgGridForm").append("<div id='TechProgForEmail' style='Display:None'></div>");

        var table = $('<table></table>');

        var Headercolumn = $("<tr style='border: 1px solid black;border-collapse: collapse'></tr>");
        for (i = 0; i < SelectedTechProgGridDataHeaders.length; i++) {
            var Headerrow = $("<td style='border: 1px solid black;border-collapse: collapse;color:red'></td>").html(SelectedTechProgGridDataHeaders[i]);
            Headercolumn.append(Headerrow);
            table.append(Headercolumn);
        }
        $(table).find('.TechProgGridFilterBtn').each(function () {
            $(this).remove();
        });
        $(table).find('.TechProgGridViewBtn').each(function () {
            $(this).remove();
        });
        $(table).find('input').each(function () {
            $(this).remove();
        });
        for (i = 0; i < hadstontabledata.length; i++) {
            var columntr = $("<tr style='border: 1px solid black;border-collapse: collapse'></tr>");
            for (j = 0; j < hadstontabledata[i].length; ++j) {
                var rowtd = $("<td style='border: 1px solid black;border-collapse: collapse'></td>").html(hadstontabledata[i][j]);
                columntr.append(rowtd)
            }
            table.append(columntr);
        }

        $('#TechProgForEmail').append(table);
    }
    // TechProg Grid Select all for print 
    function TechProgPrnAll() {
        debugger;
        var CheckVal;
        if ($("#TechProgGridPrnAllBtn").val() == "On") {
            CheckVal = true;
            $("#TechProgGridPrnAllBtn").val("Off");
        }
        else
        {
            CheckVal = false;
            $("#TechProgGridPrnAllBtn").val("On");
        }
        var Instance = $('#OperTechProgGrid').data('handsontable');
        $(Instance.getData()).each(function (index, elem) {
            elem.TechProgPrnFlag = CheckVal;
        });
        CheckOperTechProgDataChanges();
        Instance.render();
        
    }
    // TechProg Grid column Hide Unhide
    function TechProgGridColumnHideUnhide(element) {

        var column = $(element).attr('id');
        switch (column) {
            case "TechProgGridTechProgDayView":
                {
                    if (TechProgModel[0].ViewTechProgDay == true)
                        TechProgModel[0].ViewTechProgDay = false;
                    else
                        TechProgModel[0].ViewTechProgDay = true;
                }
                break;
            case "TechProgGridTechProgPrnView":
                {
                    if (TechProgModel[0].ViewTechProgPrn == true)
                        TechProgModel[0].ViewTechProgPrn = false;
                    else
                        TechProgModel[0].ViewTechProgPrn = true;
                }
                break;
            case "TechProgGridTechProgDateView":
                {
                    if (TechProgModel[0].ViewTechProgDate == true)
                        TechProgModel[0].ViewTechProgDate = false;
                    else
                        TechProgModel[0].ViewTechProgDate = true;
                }
                break;
            case "TechProgGridTechProgTimeView":
                {
                    if (TechProgModel[0].ViewTechProgTime == true)
                        TechProgModel[0].ViewTechProgTime = false;
                    else
                        TechProgModel[0].ViewTechProgTime = true;
                }
                break;
            case "TechProgGridTechProgDetailView":
                {
                    if (TechProgModel[0].ViewTechProgDetail == true)
                        TechProgModel[0].ViewTechProgDetail = false;
                    else
                        TechProgModel[0].ViewTechProgDetail = true;
                }
                break;
            case "TechProgGridTechProgDescriptionView":
                {
                    if (TechProgModel[0].ViewTechProgDescription == true)
                        TechProgModel[0].ViewTechProgDescription = false;
                    else
                        TechProgModel[0].ViewTechProgDescription = true;
                }
                break;
            case "TechProgGridTechProgViaView":
                {
                    if (TechProgModel[0].ViewTechProgVia == true)
                        TechProgModel[0].ViewTechProgVia = false;
                    else
                        TechProgModel[0].ViewTechProgVia = true;
                }
                break;
            case "TechProgGridTechProgTypeView":
                {
                    if (TechProgModel[0].ViewTechProgType == true)
                        TechProgModel[0].ViewTechProgType = false;
                    else
                        TechProgModel[0].ViewTechProgType = true;
                }
                break;
            case "TechProgGridTechProgVendorNameView":
                {
                    if (TechProgModel[0].ViewTechProgVendorName == true)
                        TechProgModel[0].ViewTechProgVendorName = false;
                    else
                        TechProgModel[0].ViewTechProgVendorName = true;
                }
                break;
            case "TechProgGridTechProgVendorAddressView":
                {
                    if (TechProgModel[0].ViewTechProgVendorAddress == true)
                        TechProgModel[0].ViewTechProgVendorAddress = false;
                    else
                        TechProgModel[0].ViewTechProgVendorAddress = true;
                }
                break;
            case "TechProgGridTechProgVendorEmailView":
                {
                    if (TechProgModel[0].ViewTechProgVendorEmail == true)
                        TechProgModel[0].ViewTechProgVendorEmail = false;
                    else
                        TechProgModel[0].ViewTechProgVendorEmail = true;
                }
                break;
            case "TechProgGridTechProgGuideNameView":
                {
                    if (TechProgModel[0].ViewTechProgGuideName == true)
                        TechProgModel[0].ViewTechProgGuideName = false;
                    else
                        TechProgModel[0].ViewTechProgGuideName = true;
                }
                break;
            case "TechProgGridTechProgGuidePhoneView":
                {
                    if (TechProgModel[0].ViewTechProgGuidePhone == true)
                        TechProgModel[0].ViewTechProgGuidePhone = false;
                    else
                        TechProgModel[0].ViewTechProgGuidePhone = true;
                }
                break;
            case "TechProgGridTechProgCityView":
                {
                    if (TechProgModel[0].ViewTechProgCity == true)
                        TechProgModel[0].ViewTechProgCity = false;
                    else
                        TechProgModel[0].ViewTechProgCity = true;
                }
                break;
            case "TechProgGridTechProgAreaView":
                {
                    if (TechProgModel[0].ViewTechProgArea == true)
                        TechProgModel[0].ViewTechProgArea = false;
                    else
                        TechProgModel[0].ViewTechProgArea = true;
                }
                break;
            default:
                break;
        }
        LoadTechProgGrid(true);
    }
    function TechProgGridSave() {
        
        var Rows = $('#OperTechProgGrid').data('handsontable').getData();
        var SelectedTechProgFilterType = [];
        $('#TechProgGridTypeMainDiv input[name=SelectedTechProgFilterType]:checked').each(function () {
            SelectedTechProgFilterType.push($(this).val());
        });

        var OperationTechProgGridViewModel = {
            SaveRows: [],
            // show hide
            ViewTechProgDay: TechProgModel[0].ViewTechProgDay,
            ViewTechProgPrn: TechProgModel[0].ViewTechProgPrn,
            ViewTechProgDate: TechProgModel[0].ViewTechProgDate,
            ViewTechProgTime: TechProgModel[0].ViewTechProgTime,
            ViewTechProgDetail: TechProgModel[0].ViewTechProgDetail,
            ViewTechProgDescription: TechProgModel[0].ViewTechProgDescription,
            ViewTechProgVia: TechProgModel[0].ViewTechProgVia,
            ViewTechProgType: TechProgModel[0].ViewTechProgType,
            ViewTechProgVendorName: TechProgModel[0].ViewTechProgVendorName,
            ViewTechProgVendorAddress: TechProgModel[0].ViewTechProgVendorAddress,
            ViewTechProgVendorEmail: TechProgModel[0].ViewTechProgVendorEmail,
            ViewTechProgGuideName: TechProgModel[0].ViewTechProgGuideName,
            ViewTechProgGuidePhone: TechProgModel[0].ViewTechProgGuidePhone,
            ViewTechProgCity: TechProgModel[0].ViewTechProgCity,
            ViewTechProgArea: TechProgModel[0].ViewTechProgArea,
            // search part
            TechProgSearchGroupCode: $("#TechProgSearchGroupCode").val(),
            TechProgGroupIDTxt: $("#TechProgGroupIDTxt").val(),
            // scroll part
            TechProgLeftScrollPossition: parseFloat($("#OperTechProgGrid").scrollLeft()),
            TechProgTopScrollPossition: parseFloat($("#OperTechProgGrid").scrollTop()),
            // Filter part   
            SelectedTechProgFilterType: SelectedTechProgFilterType.length > 0 ? SelectedTechProgFilterType : [],
        };
      
        $(Rows).each(function (index, elem) {
            if (index < Rows.length - 1) {
                var RowItm = {
                    TechProgGroupID: elem.TechProgGroupID,
                    TechProgDate: elem.TechProgDate,
                    TechProgTime: elem.TechProgTime,
                    TechProgOldTime: elem.TechProgOldTime,
                    TechProgPrnFlag: elem.TechProgPrnFlag,
                    TechProgDesc: elem.TechProgDesc,
                    TechProgVia: elem.TechProgVia,
                    TechProgDetailID: TechProgGetIDFromList(TechProgModel[0].TechProgDetail, elem.TechProgDetail),
                };
                OperationTechProgGridViewModel.SaveRows.push(RowItm);
            }
        });
        var DTO = JSON.stringify(OperationTechProgGridViewModel);

        $.ajax({
            url: urls["OperationTechProgGridSave"],
            type: 'POST',
            contentType: 'application/json; charset=utf-8',
            data: DTO,
            success: function (data) {
                $("#tabTechProg").html(data);
            },
            error: function (xhr) {
                //   alert('Error: ' + xhr.statusText);
            },
            complete: function () {
                if ($("#TechProgLeftScrollPossition").val() != "") {
                    $("#OperTechProgGrid").scrollLeft(parseFloat($("#TechProgLeftScrollPossition").val()));
                }
                if ($("#TechProgTopScrollPossition").val() != "") {
                    $("#OperTechProgGrid").scrollTop(parseFloat($("#TechProgTopScrollPossition").val()));
                }
            }
        });
    }

    function ValidateTechProg() {
        $.ajax({
            url: urls["ValidateOperationTechProgTab"],
            type: 'POST',
            data: { 'GroupCode': $("#TechProgSearchGroupCode").val() },
            success: function (data) {
                $("#tabTechProg").html(data);
            },
            error: function (xhr) {
                //   alert('Error: ' + xhr.statusText);
            },
            complete: function () {
                if($("#TechProgErrorMessage").val() != "")
                    jAlert($("#TechProgErrorMessage").val(), 'Error!');
            }
        });
    }
    function TechProgGetIDFromList(List, selItem) {
        var RetVal = 0;
        $(List).each(function (index, elem) {
            if (elem.Text == selItem)
                RetVal = parseInt(elem.Value);
        });
        return RetVal;
    }
    $(document).on("copy", "#TechProgGetSelected", function (e) {
        
        TechProgGetSelectedClick();
        var table = $("#TechProgForEmail");
        e.clipboardData.clearData();
        e.clipboardData.setData("text/html", table.html());
        e.preventDefault();
        $("#TechProgForEmail").remove();
        $("#TechProgGetSelected").attr('disabled', true);

    });
    function CheckOperTechProgDataChanges() {
        if (!$("#TechProgSaveBtn").hasClass("GridDataChanged"))
            $("#TechProgSaveBtn").addClass("GridDataChanged");
    }
    // report Tech Prog
    $(document).on('click', '#TechProgReportBtn', function () {
        window.open("../Report/TechProgReport?GroupID=" + $("#TechProgGroupIDTxt").val());
    });
    function RemoveTechProgFilter(element) {
        debugger
        var columnFilter = $(element).attr('id');
        switch (columnFilter) {
            case "TechProgRemoveTypeFilter":
                {
                    $("#TechProgIsRemoveTypeFilter").val("True");
                }
                break;
            default:
                break;
        }
        $("#IsTechProgFilter").val("True");
        isTechProgFilter = "True";
        $("#TechProgGridUpdate").click();
    }
</script>
<div class="OperationTabsTitleDiv">
    <span class="OperationTabsTitle">Tech Prog</span>
</div>
@using (Ajax.BeginForm("SaveOperationTechProgGridData", "Operation", new AjaxOptions() { HttpMethod = "Post", UpdateTargetId = "tabTechProg", OnComplete = "TechProgGridAjaxComplated", InsertionMode = InsertionMode.Replace }, new { enctype = "multipart/form-data", id = "OperTechProgGridForm" }))
{
    <div style="padding-bottom:10px;">
        <div style="float:left;">
                @Html.HiddenFor(model => Model.TechProgGroupIDTxt)
                @Html.HiddenFor(model => Model.TechProgErrorMessage)
                @Html.TextBoxFor(model => Model.TechProgSearchGroupCode, new { @class = "TxtComplete table_inputs_180", @placeholder = "Group Code" })
        </div>
        <button class="btn14 btn50" onclick="OperTechProgSearch()" type="button">Go</button>
        @if(Model.TechProgGroupIDTxt > 0)
        {
            if(Model.TechProgUpdated)
            { 
                <button class="btn14 btn60 BackColorRed" onclick="ValidateTechProg()" type="button">Validate</button>
            }
            else
            {
                <button class="btn14 btn60" style="background-color:green;" onclick="ValidateTechProg()" type="button">Validate</button>
            }
            @Html.LabelForModel(Model.TechProgUpdtDate, new { @class = "table_inputs_120"})
        }
    </div>
        <div id="TechProgGridTechProgDayDiv" style="@(@Model.ViewTechProgDay ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Day</span><div id="TechProgGridTechProgDayView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgPrnDiv" style="@(@Model.ViewTechProgPrn ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Prn</span><div id="TechProgGridTechProgPrnView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgDateDiv" style="@(@Model.ViewTechProgDate ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Date</span><div id="TechProgGridTechProgDateView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgTimeDiv" style="@(@Model.ViewTechProgTime ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Time</span><div id="TechProgGridTechProgTimeView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgDetailDiv" style="@(@Model.ViewTechProgDetail ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Detail</span><div id="TechProgGridTechProgDetailView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgDescriptionDiv" style="@(@Model.ViewTechProgDescription ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Description</span><div id="TechProgGridTechProgDescriptionView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgEmployeeDiv" style="@(@Model.ViewTechProgDescription ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Employee</span><div id="TechProgGridTechProgEmployeeView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgViaDiv" style="@(@Model.ViewTechProgVia ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Via</span><div id="TechProgGridTechProgViaView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgTypeDiv" style="@(@Model.ViewTechProgType ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Type</span><div id="TechProgGridTechProgTypeView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgVendorNameDiv" style="@(@Model.ViewTechProgVendorName ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Vendor</span><div id="TechProgGridTechProgVendorNameView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgVendorAddressDiv" style="@(@Model.ViewTechProgVendorAddress ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Vendor Address</span><div id="TechProgGridTechProgVendorAddressView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgVendorEmailDiv" style="@(@Model.ViewTechProgVendorEmail ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Vendor Email</span><div id="TechProgGridTechProgVendorEmailView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgGuideNameDiv" style="@(@Model.ViewTechProgGuideName ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Guide</span><div id="TechProgGridTechProgGuideNameView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgGuidePhoneDiv" style="@(@Model.ViewTechProgGuidePhone ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Guide Phone</span><div id="TechProgGridTechProgGuidePhoneView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgCityDiv" style="@(@Model.ViewTechProgCity ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>City</span><div id="TechProgGridTechProgCityView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGridTechProgAreaDiv" style="@(@Model.ViewTechProgArea ? "display:none" : "")">
            <div class="TechProgGridViewBtnDiv">
                <span>Area</span><div id="TechProgGridTechProgAreaView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
    if (Model.Rows != null && Model.TechProgGroupIDTxt > 0)
    { 
         if(Model.Rows.Any(row=>row.TechProgPrnFlag == false))
         { 
            <span style="padding-right:5px;">Print All</span><input type="button" class="btn14 btn60" id="TechProgGridPrnAllBtn" onclick="TechProgPrnAll()" value="On">
         }
         else
         {
            <span style="padding-right:5px;">Print All</span><input type="button" class="btn14 btn60" id="TechProgGridPrnAllBtn" onclick="TechProgPrnAll()" value="Off">
         }
    }
    <div id="TechProgRemoveFiltersDiv" class="TechProgRemoveFiltersDiv" style="display:none">
        <span class="TechProgRemoveFiltersSpan">Filters :</span>
        @if (Model.TechProgFilterSelType != null)
        {
            if (Model.TechProgFilterSelType.Count > 0)
            {
                <div class="TechProgGridViewBtnDiv"><span>Type</span><div id="TechProgRemoveTypeFilter" class="TechProgGridViewBtn" onclick="RemoveTechProgFilter(this)"></div></div>
                Model.TechProgIsRemoveFilterDivShow = true;
            }
        }
    </div>
    <div id="OperTechProgGridFilters" style="width:1200px; float:left; padding-top:12px; padding-right:5px; padding-bottom:8px;">
        <div id="TechProgGridTypeMainDiv" class="TechProgGridFilterDiv">
            <div class="TechProgGridFilterDivClose"></div>
            @Html.CheckBoxListFor(model => model.SelectedTechProgFilterType,
                                  model => model.TechProgFilterType,
                                  grp => grp.Id,
                                  grp => grp.Name,
                                  model => model.TechProgFilterSelType,
                                  MvcCheckBoxList.Model.Position.Vertical)
        </div>
    </div>
    <div id="OperTechProgGrid" class="handsontable" style="width: 1185px; height: 280px; overflow: auto; display: none;"></div>
    <div style="display:none;">
        <div id="TechProgDayDiv">
            <div class="OperationHandsontable">
                <span>Day</span>
                @Html.HiddenFor(model => model.ViewTechProgDay)
                <div id="TechProgGridTechProgDayView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgPrnDiv">
            <div class="OperationHandsontable">
                <span>Prn</span>
                @Html.HiddenFor(model => model.ViewTechProgPrn)
                <div id="TechProgGridTechProgPrnView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgDateDiv">
            <div class="OperationHandsontable">
                <span>Date</span>
                @Html.HiddenFor(model => model.ViewTechProgDate)
                <div id="TechProgGridTechProgDateView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgTimeDiv">
            <div class="OperationHandsontable">
                <span>Time</span>
                @Html.HiddenFor(model => model.ViewTechProgTime)
                <div id="TechProgGridTechProgTimeView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgDetailDiv">
            <div class="OperationHandsontable">
                <span>Detail</span>
                @Html.HiddenFor(model => model.ViewTechProgDetail)
                <div id="TechProgGridTechProgDetailView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgDescriptionDiv">
            <div class="OperationHandsontable">
                <span>Description</span>
                @Html.HiddenFor(model => model.ViewTechProgDescription)
                <div id="TechProgGridTechProgDescriptionView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgEmployeeDiv">
            <div class="OperationHandsontable">
                <span>Employee</span>
                @Html.HiddenFor(model => model.ViewTechProgDescription)
                <div id="TechProgGridTechProgEmployeeView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgViaDiv">
            <div class="OperationHandsontable">
                <span>Via</span>
                @Html.HiddenFor(model => model.ViewTechProgVia)
                <div id="TechProgGridTechProgViaView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgTypeDiv">
            <div class="OperationHandsontable">
                <span>Type</span>
                @Html.HiddenFor(model => model.ViewTechProgType)
                <div id="TechProgGridTechProgTypeView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
                @if (@Model.OperationTechProgTypeFilter)
                {
                    <div class="TechProgGridFilterBtn" id="TechProgGridType"></div>
                }
            </div>
        </div>
        <div id="TechProgVendorNameDiv">
            <div class="OperationHandsontable">
                <span>Vendor</span>
                @Html.HiddenFor(model => model.ViewTechProgVendorName)
                <div id="TechProgGridTechProgVendorNameView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgVendorAddressDiv">
            <div class="OperationHandsontable">
                <span>Vendor Address</span>
                @Html.HiddenFor(model => model.ViewTechProgVendorAddress)
                <div id="TechProgGridTechProgVendorAddressView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgCityDiv">
            <div class="OperationHandsontable">
                <span>City</span>
                @Html.HiddenFor(model => model.ViewTechProgCity)
                <div id="TechProgGridTechProgCityView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgAreaDiv">
            <div class="OperationHandsontable">
                <span>Area</span>
                @Html.HiddenFor(model => model.ViewTechProgArea)
                <div id="TechProgGridTechProgAreaView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgVendorEmailDiv">
            <div class="OperationHandsontable">
                <span>Vendor Email</span>
                @Html.HiddenFor(model => model.ViewTechProgVendorEmail)
                <div id="TechProgGridTechProgVendorEmailView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGuideNameDiv">
            <div class="OperationHandsontable">
                <span>Guide</span>
                @Html.HiddenFor(model => model.ViewTechProgGuideName)
                <div id="TechProgGridTechProgGuideNameView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
        <div id="TechProgGuidePhoneDiv">
            <div class="OperationHandsontable">
                <span>Guide Phone</span>
                @Html.HiddenFor(model => model.ViewTechProgGuidePhone)
                <div id="TechProgGridTechProgGuidePhoneView" class="TechProgGridViewBtn" onclick="TechProgGridColumnHideUnhide(this)"></div>
            </div>
        </div>
    </div>
    @Html.HiddenFor(model => model.IsTechProgFilter)
    @Html.HiddenFor(model => model.TechProgIsSearch)
    @Html.HiddenFor(model => model.IsTechProgView)
    @Html.HiddenFor(model => model.TechProgLeftScrollPossition)
    @Html.HiddenFor(model => model.TechProgTopScrollPossition)

    @Html.HiddenFor(model => model.TechProgIsRemoveFilterDivShow)
    @Html.HiddenFor(model => model.TechProgIsRemoveTypeFilter)
    if (Model.Rows != null && Model.TechProgGroupIDTxt > 0)
    {
       <button class="btn14 pull-right" id="TechProgSaveBtn" onclick="TechProgGridSave()" style="margin-top:10px; margin-right:7px;" type="button">Save</button>
       <input type="button" id="TechProgReportBtn" class="btn14  btn90 pull-left" style="margin-top:10px;" value="Preview">
       <input type="button" id="TechProgGetSelected" class="btn14 btn120 pull-right" value="Copy For Email" disabled="disabled" style="margin-top:10px;margin-right:10px;">
    }
    <button style="display:none;" id="TechProgGridUpdate" type="submit"></button>
}





